<div id="container">
  <vm-player #player playsinline (vPlaybackReady)="onPlaybackReady()">
    <vm-video cross-origin="true" poster="https://media.vimejs.com/poster.png">
      <source data-src="https://media.vimejs.com/720p.mp4" type="video/mp4" />
      <track
        default
        kind="subtitles"
        src="https://media.vimejs.com/subs/english.vtt"
        srclang="en"
        label="English"
      />
      <track
        kind="subtitles"
        src="https://media.vimejs.com/subs/spanish.vtt"
        srclang="es"
        label="Spanish"
      />
    </vm-video>

    <vm-default-ui>
      <!-- Custom UI component. -->
      <tap-sides-to-seek></tap-sides-to-seek>
    </vm-default-ui>
  </vm-player>
</div>

<style>
  :host {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  #container {
    width: 100%;
    max-width: 960px;
  }
</style>
